{% extends "base.html" %}
{% load display_tags %}
{% load authorization_tags %}

{% block content %}
<h3 id="id_heading"> Group: {{ group.name }}</h3>
<div class="row">
    <div id="tests" class="col-md-8">
        <div class="panel panel-default">
            <div class="panel-heading tight">
                <div class="clearfix">
                    <h3 class="pull-left">Description</h3>
                    <div class="dropdown pull-right">
                        <div class="btn-group">
                            <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1"
                                    aria-label="Actions" data-toggle="dropdown" aria-expanded="true">
                                <span class="fa-solid fa-bars"></span>
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dropdownMenu1">
                                {% if group|has_object_permission:"Group_Edit" %}
                                <li>
                                    <a class="" href="{% url 'edit_group' group.id %}">
                                        <i class="fa-solid fa-pen-to-square"></i> Edit</a>
                                </li>
                                {% endif %}
                                {% if group|has_object_permission:"Group_Delete" %}
                                <li role="separator" class="divider"></li>
                                <li>
                                    <a class="" href="{% url 'delete_group' group.id %}" id="deleteUser">
                                        <i class="fa-solid fa-trash"></i> Delete</a>
                                </li>
                                {% endif %}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel-body">
                {{ group.description|markdown_render }}
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="clearfix">
                    <h4 class="pull-left">Members of this Group</h4>
                    &nbsp;
                    <a href="https://docs.defectdojo.com/en/customize_dojo/user_management/create_user_group/#manage-a-groups-users" target="_blank">
                        <i class="fa-solid fa-circle-question"></i></a>
                    {% if group|has_object_permission:"Group_Manage_Members" %}
                    <div class="dropdown pull-right">
                        <button class="btn btn-primary dropdown-toggle" aria-label="Actions" type="button" id="dropdownMenuAddGroupMember"
                                data-toggle="dropdown" aria-expanded="true">
                            <span class="fa-solid fa-bars"></span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dropdownMenu2">
                            <li role="presentation">
                                <a id="addGroupMember" href="{% url 'add_group_member' group.id %}">
                                    <i class="fa-solid fa-plus"></i> Add Users
                                </a>
                            </li>
                        </ul>
                    </div>
                    {% endif %}
                </div>
            </div>
            {% if group_members %}
            <div class="table-responsive">
                <table class="tablesorter-bootstrap table table-condensed table-striped">
                    <thead>
                    <tr>
                        <th label="Actions"></th>
                        <th>User</th>
                        <th>Role in this Group</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for member in group_members %}
                    <tr>
                        <td>
                            <ul>
                                <li class="dropdown" style="list-style:none;position:absolute">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true" label="Actions" name="dropdownManageGroupMembers">&nbsp;<b class="fa-solid fa-ellipsis-vertical"></b>&nbsp;</a>
                                    <ul class="dropdown-menu">
                                        {% if group|has_object_permission:"Group_Manage_Members" %}
                                        <li>
                                            <a name="editGroupMember" href="{% url 'edit_group_member' member.id %}">
                                                <i class="fa-solid fa-pen-to-square"></i>Edit</a>
                                        </li>
                                        {% endif %}
                                        {% if member|has_object_permission:"Group_Member_Delete" %}
                                        <li>
                                            <a name="deleteGroupMember" href="{% url 'delete_group_member' member.id %}">
                                                <i class="fa-solid fa-trash"></i> Delete</a>
                                        </li>
                                        {% endif %}
                                    </ul>
                                </li>
                            </ul>
                        </td>
                        <td name="member_user">{{ member.user.get_full_name }}</td>
                        <td name="member_role">{{ member.role }}</td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="panel-body">
                <small class="text-muted"><em>This Group has no members.</em></small>
            </div>
            {% endif %}
        </div>

        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="clearfix">
                    <h4 class="pull-left">{{ labels.ORG_GROUPS_LABEL }}</h4>
                    &nbsp;
                    <a href="https://docs.defectdojo.com/en/customize_dojo/user_management/create_user_group/#add-product-roles-or-product-type-roles-for-a-group" target="_blank">
                        <i class="fa-solid fa-circle-question"></i></a>
                    {% if request.user.is_superuser %}
                    <div class="dropdown pull-right">
                        <button class="btn btn-primary dropdown-toggle" aria-label="Actions" type="button" id="dropdownMenuAddProductTypeGroup"
                                data-toggle="dropdown" aria-expanded="true">
                            <span class="fa-solid fa-bars"></span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dropdownMenu2">
                            <li role="presentation">
                                <a id="addProductTypeGroup" href="{% url 'add_product_type_group_group' group.id %}">
                                    <i class="fa-solid fa-plus"></i> {{ labels.ORG_GROUPS_ADD_ORGANIZATIONS_LABEL }}
                                </a>
                            </li>
                        </ul>
                    </div>
                    {% endif %}
                </div>
            </div>
            {% if product_types %}
            <div class="table-responsive">
                <table class="tablesorter-bootstrap table table-condensed table-striped">
                    <thead>
                    <tr>
                        <th></th>
                        <th>{{ labels.ORG_LABEL }}</th>
                        <th>Role</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for product_type_group in product_types %}
                    <tr>
                        <td>
                            <ul>
                                <li class="dropdown" style="list-style:none;position:absolute">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" name="dropdownManageProductTypeGroup"
                                       aria-expanded="true">&nbsp;<b class="fa-solid fa-ellipsis-vertical"></b>&nbsp;</a>
                                    <ul class="dropdown-menu">
                                        {% if product_type_group.product_type|has_object_permission:"Product_Type_Group_Edit" %}
                                        <li>
                                            <a name="editProductTypeGroup" href="{% url 'edit_product_type_group' product_type_group.id %}">
                                                <i class="fa-solid fa-pen-to-square"></i> Edit</a>
                                        </li>
                                        {% endif %}
                                        {% if product_type_group|has_object_permission:"Product_Type_Group_Delete" %}
                                        <li>
                                            <a name="deleteProductTypeGroup" href="{% url 'delete_product_type_group' product_type_group.id %}">
                                                <i class="fa-solid fa-trash"></i> Delete</a>
                                        </li>
                                        {% endif %}
                                    </ul>
                                </li>
                            </ul>
                        </td>
                        <td name="member_product_type"><a href="{% url 'view_product_type' product_type_group.product_type.id %}">{{ product_type_group.product_type }}</a></td>
                        <td name="member_product_type_role">{{ product_type_group.role }}</td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="panel-body">
                <small class="text-muted"><em>{{ labels.ORG_GROUPS_NO_ACCESS_MESSAGE }}</em></small>
            </div>
            {% endif %}
        </div>

        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="clearfix">
                    <h4 class="pull-left">{{ labels.ASSET_GROUPS_ACCESS_LABEL }}</h4>
                    &nbsp;
                    <a href="https://docs.defectdojo.com/en/customize_dojo/user_management/create_user_group/#add-product-roles-or-product-type-roles-for-a-group" target="_blank">
                        <i class="fa-solid fa-circle-question"></i></a>
                    {% if request.user.is_superuser %}
                    <div class="dropdown pull-right">
                        <button class="btn btn-primary dropdown-toggle" aria-label="Actions" type="button"  id="dropdownMenuAddProductGroup"
                                data-toggle="dropdown" aria-expanded="true">
                            <span class="fa-solid fa-bars"></span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dropdownMenu3">
                            <li role="presentation">
                                <a id="addProductGroup" href="{% url 'add_product_group_group' group.id %}">
                                    <i class="fa-solid fa-plus"></i> {{ labels.ASSET_GROUPS_ADD_ASSETS_LABEL }}
                                </a>
                            </li>
                        </ul>
                    </div>
                    {% endif %}
                </div>
            </div>
            {% if products %}
            <div class="table-responsive">
                <table class="tablesorter-bootstrap table table-condensed table-striped">
                    <thead>
                    <tr>
                        <th></th>
                        <th>{{ labels.ASSET_LABEL }}</th>
                        <th>Role</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for product_group in products %}
                    <tr>
                        <td>
                            <ul>
                                <li class="dropdown" style="list-style:none;position:absolute">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" name="dropdownManageProductGroup"
                                       aria-expanded="true">&nbsp;<b class="fa-solid fa-ellipsis-vertical"></b>&nbsp;</a>
                                    <ul class="dropdown-menu">
                                        {% if product_group.product|has_object_permission:"Product_Group_Edit" %}
                                        <li>
                                            <a name="editProductGroup" href="{% url 'edit_product_group' product_group.id %}">
                                                <i class="fa-solid fa-pen-to-square"></i> Edit</a>
                                        </li>
                                        {% endif %}
                                        {% if product_group|has_object_permission:"Product_Group_Delete" %}
                                        <li>
                                            <a name="deleteProductGroup" href="{% url 'delete_product_group' product_group.id %}">
                                                <i class="fa-solid fa-trash"></i> Delete</a>
                                        </li>
                                        {% endif %}
                                    </ul>
                                </li>
                            </ul>
                        </td>
                        <td name="member_product"><a href="{% url 'view_product' product_group.product.id %}">{{ product_group.product }}</a></td>
                        <td name="member_product_role">{{ product_group.role }}</td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="panel-body">
                <small class="text-muted"><em>{{ labels.ASSET_GROUPS_NO_ACCESS_MESSAGE }}</em></small>
            </div>
            {% endif %}
        </div>
    </div>
    <div class="col-md-4">
        <div class="panel panel-default-secondary">
            <div class="panel-heading">
                <h3 class="panel-title"><span class="fa-solid fa-circle-info fa-fw" aria-hidden="true"></span>
                    Metadata
                </h3>
            </div>
            <div class="table-responsive">
                <table class="table table-striped">
                    <tbody>
                        {% block metadata %}
                            <tr>
                                <td style="width: 200px;"><strong>Number of Users</strong></td>
                                <td>
                                    {{ group.users.all|length }}
                                </td>
                            </tr>
                            <tr>
                                <td style="width: 200px;"><strong>{{ labels.ORG_GROUPS_NUM_ORGANIZATIONS_LABEL }}</strong></td>
                                <td>
                                    {{ product_types|length }}
                                </td>
                            </tr>
                            <tr>
                                <td style="width: 200px;"><strong>{{ labels.ASSET_GROUPS_NUM_ASSETS_LABEL }}</strong></td>
                                <td>
                                    {{ products|length }}
                                </td>
                            </tr>
                            <tr>
                                <td style="width: 200px;"><strong>Global role</strong></td>
                                <td>{% if group.global_role.role %} {{ group.global_role.role }} {% endif %}</td>
                            </tr>
                        {% endblock metadata %}
                    </tbody>
                </table>
            </div>
        </div>
        <!-- Configuration permissions -->
        <div class="panel panel-default-secondary" id="edit_permissions">
            <div class="panel-heading">
                <h3 class="panel-title"><span class="fa-solid fa-lock-open-alt" aria-hidden="true"></span>&nbsp;&nbsp;Configuration Permissions</h3>
            </div>
            <form id="edit_permissions_form" class="form-horizontal" method="post" action="{% url 'edit_group_permissions' group.id %}">{% csrf_token %}
            <div class="table-responsive">
                <table class="table table-striped">
                    <tr>
                        <td id="saving_permissions">&nbsp;</td>
                        <td class="centered"><strong>View</strong></td>
                        <td class="centered"><strong>Add</strong></td>
                        <td class="centered"><strong>Edit</strong></td>
                        <td class="centered"><strong>Delete</strong></td>
                    </tr>
                    {% for field in configuration_permission_form.permission_fields %}
                    <tr>
                        <td><strong>{{ field.display_name }}</strong></td>
                        <td class="centered">
                            {% if field.view_codename %}
                            <input id="id_{{ field.view_codename }}"
                                {% if not request.user.is_superuser %}disabled{% endif %}
                                name="{{ field.view_codename }}"
                                aria-label="{{ field.view_codename }}"
                                type="checkbox"
                                {% if group.auth_group|group_has_configuration_permission:field.view_codename %}checked{% endif %} />
                            {% endif %}
                        </td>
                        <td class="centered">
                            {% if field.add_codename %}
                            <input id="id_{{ field.add_codename }}"
                                {% if not request.user.is_superuser %}disabled{% endif %}
                                name="{{ field.add_codename }}"
                                aria-label="{{ field.add_codename }}"
                                type="checkbox"
                                {% if group.auth_group|group_has_configuration_permission:field.add_codename %}checked{% endif %} />
                            {% endif %}
                        </td>
                        <td class="centered">
                            {% if field.change_codename %}
                            <input id="id_{{ field.change_codename }}"
                                {% if not request.user.is_superuser %}disabled{% endif %}
                                name="{{ field.change_codename }}"
                                aria-label="{{ field.change_codename }}"
                                type="checkbox"
                                {% if group.auth_group|group_has_configuration_permission:field.change_codename %}checked{% endif %} />
                            {% endif %}
                        </td>
                        <td class="centered">
                            {% if field.delete_codename %}
                            <input id="id_{{ field.delete_codename }}"
                                {% if not request.user.is_superuser %}disabled{% endif %}
                                name="{{ field.delete_codename }}"
                                aria-label="{{ field.delete_codename }}"
                                type="checkbox"
                                {% if group.auth_group|group_has_configuration_permission:field.delete_codename %}checked{% endif %} />
                            {% endif %}
                        </td>
                    </tr>
                    {% endfor %}
                </table>
            </div>
            </form>
        </div>
        <!-- End Configuration Permissions -->
    </div>
</div>
{% endblock %}
{% block postscript %}
{{ block.super }}
<script type="text/javascript">

    $(function() {
        $('div#edit_permissions input[type=checkbox]').on('click', function() {
            $('#saving_permissions').append(' <small>(saving...)</small>')
            $('#edit_permissions_form').submit()
        });
    });

</script>
{% endblock %}
